$(document).ready(function() {
	
	$(".number").live("keyup focusout", function() {
		var number = $(this).val().replace(/[^0-9]/gi, '');
		if (number != '') {
			$(this).val(parseInt(number));
		}
	});
	
	
	$( "#dialogSoLuong" ).hide();
	$( "#chiTietGioHang" ).hide();
	
	$(".addToCart").click(function () {
		var id = $(this).attr('id');
		var arrId = id.split('_');
		var index = arrId[1];
		
		$("#txtSoLuong").val('');
		$("#error").html('');
		$( "#dialogSoLuong" ).dialog({
	        resizable: false,
	        height:210,
	        width:350,
	        modal: true,
	        buttons: {
	            "Thêm": function() {
	            	var $soLuong = $("#txtSoLuong").val();
	            	var intRegex = /^[1-9]+\d*$/;
	            	if ($soLuong == '') {
	            		$("#error").html('Vui lòng nhập vào số lượng');
	            	}
	            	else if (!intRegex.test($soLuong)) {
	            		$("#error").html('Số lượng phải là một số nguyên lớn hơn 0');
	            	}
	            	else {
	            		$("#error").css('color', '#bbbbbb');
	            		$("#error").html('Vui lòng đợi giây lát...');
	            		//call ajax add to cart
	            		var $url = $("#url_" + index).val() + '/' + $soLuong;
		                $.ajax({
		                    url: $url,
		                    dataType: "json",
		                    type: "POST",
		                    contentType: "application/json; charset=shift_jis",
		                    success: function (data) {
		                    	if (data['result'] == 'ok') {
		                    		
		                    		$("#spTrongGioHang").html( data['total'] );
		                    		$("#dialogSoLuong").dialog( "close" );
		                    	}
		                    	else {
		                    		$("#error").css('color', 'red');
		                    		$("#error").html('Thêm vào giỏ hàng thất bại, xin lỗi vì sự bất tiện này');
		                    	}
		                    },
		                	error: function (X) {
		                		$("#error").css('color', 'red');
	                    		$("#error").html('Thêm vào giỏ hàng thất bại, xin lỗi vì sự bất tiện này');
		                	}
		                });
	            	}
	            },
	            "Hủy Bỏ": function() {
	                $( this ).dialog( "close" );
	            }
	        }
	    });
	});
	
	//format number
	function addCommas(nStr) {
	    nStr += '';
	    x = nStr.split('.');
	    x1 = x[0];
	    x2 = x.length > 1 ? '.' + x[1] : '';
	    var rgx = /(\d+)(\d{3})/;
	    while (rgx.test(x1)) {
	        x1 = x1.replace(rgx, '$1' + ',' + '$2');
	    }
	    return x1 + x2;
	}
	
	//delete a row of detail
	$(".btnDelete").live("click", function (){
		var id = $(this).attr('id');
		var arrId = id.split('_');
		var removeId = '';
		for (var i=0; i<arrId.length-1; i++) {
			removeId += arrId[i];
			if (i != (arrId.length-2)) {
				removeId += '_';
			}
		}
		$("#" + removeId).remove();
	});
	
	//btnSave
	$("#btnSave").click(function (){
		var $url = $("#url_" + index).val() + '/' + $soLuong;
        $.ajax({
            url: $url,
            dataType: "json",
            type: "POST",
            contentType: "application/json; charset=shift_jis",
            success: function (data) {
            	if (data['result'] == 'ok') {
            		
            		$("#spTrongGioHang").html( data['total'] );
            		$("#dialogSoLuong").dialog( "close" );
            	}
            	else {
            		$("#error").css('color', 'red');
            		$("#error").html('Thêm vào giỏ hàng thất bại, xin lỗi vì sự bất tiện này');
            	}
            },
        	error: function (X) {
        		$("#error").css('color', 'red');
        		$("#error").html('Thêm vào giỏ hàng thất bại, xin lỗi vì sự bất tiện này');
        	}
        });
	});
	
	//call ajax and show dialog
	$("#showGioHang").click(function () {
		var $url = $("#urlGioHang").val();
	    $.ajax({
	        url: $url,
	        dataType: "json",
	        type: "POST",
	        contentType: "application/json; charset=shift_jis",
	        success: function (data) {
	        	var htmlGioHang = '';
	        	var rootUrl = '/googleSVN/web/bundles/frontend/';
	        	if(data.length <= 0) {
	        		htmlGioHang += "<p class='error'>Giỏ hàng hiện chưa có sản phẩm.</p>";
	        		htmlGioHang += "<p class='error'>Vui lòng chọn sản phẩm và bấm 'Thêm vào giỏ hàng'.</p>";
	        	}
	        	else {
					htmlGioHang += "<table width='100%' id='form_chi_tiet_gio_hang'>";
					htmlGioHang += "<tr>";
					htmlGioHang += "<th witdh='10%'>";
					htmlGioHang += "Mã SP";
					htmlGioHang += "</th>";
					htmlGioHang += "<th witdh='30%'>";
					htmlGioHang += "Tên sản phẩm";
					htmlGioHang += "</th>";
					htmlGioHang += "<th witdh='15%'>";
					htmlGioHang += "Hình ảnh";
					htmlGioHang += "</th>";
					htmlGioHang += "<th witdh='15%'>";
					htmlGioHang += "Số lượng";
					htmlGioHang += "</th>";
					htmlGioHang += "<th witdh='10%'>";
					htmlGioHang += "Đơn giá";
					htmlGioHang += "</th>";
					htmlGioHang += "<th witdh='20%'>";
					htmlGioHang += "Thành tiền";
					htmlGioHang += "</th>";
					htmlGioHang += "</tr>";
	        		for (var i=0; i<data.length; i++) {
	        			var sanPham = data[i];
	        			var id = sanPham['id'];
	        			var tenSp = sanPham['tenSp'];
	        			var hinhAnh = sanPham['hinhAnh'];
	        			var soLuong = sanPham['soLuong'];
	        			var donGia = sanPham['donGia'];
	        			if (i != data.length-1) {
	        				htmlGioHang += "<tr style='border-bottom: solid 1px #bbbbbb' id='form_chi_tiet_gio_hang_" + i + "'>";
						}
	        			else {
	        				htmlGioHang += "<tr id='form_chi_tiet_gio_hang_" + i + "'>";
	        			}
						
						htmlGioHang += "<td>";
						htmlGioHang += id;
						htmlGioHang += "</td>";
						htmlGioHang += "<td>";
						htmlGioHang += tenSp;
						htmlGioHang += "</td>";
						htmlGioHang += "<td>";
						htmlGioHang += "<img src='" + rootUrl + hinhAnh + "' alt='' />";
						htmlGioHang += "</td>";
						htmlGioHang += "<td>";
						htmlGioHang += "<input class='number' type='text' id='form_chi_tiet_gio_hang_" + i + "_soLuong' name='form_chi_tiet_gio_hang_[" + i + "][soLuong]' value='" + soLuong + "' maxlength='3' size='3' />";
						htmlGioHang += "<input type='hidden' id='form_chi_tiet_gio_hang_" + i + "_id' name='form_chi_tiet_gio_hang_[" + i + "][id]'value='" + id + "' maxlength='3' size='3' />";
						htmlGioHang += "</td>";
						htmlGioHang += "<td style='text-align: right; padding-right: 20px;'>";
						htmlGioHang += "<span class='dongia' id='form_chi_tiet_gio_hang_" + i + "_donGia'>" + addCommas(donGia) + "</span>";
						htmlGioHang += "</td>";
						htmlGioHang += "<td>";
						htmlGioHang += "<span class='dongia' id='form_chi_tiet_gio_hang_" + i + "_donGia'>" + addCommas(soLuong * donGia) + "</span>";
						htmlGioHang += "</td>";
						htmlGioHang += "<td>";
						htmlGioHang += "<a class='btnDelete' id='form_chi_tiet_gio_hang_" + i + "_delete'><img style='height: 25px; width: 25px;' src='" + rootUrl + "images/btnDelete.jpg' alt='' /></a>";
						htmlGioHang += "</td>";
						htmlGioHang += "</tr>";
	        		}
	        		htmlGioHang += "</table>";
	        	}
	        	
	        	$( "#chiTietGioHang" ).html(htmlGioHang);
	        	$( "#chiTietGioHang" ).dialog({
	    	        resizable: false,
	    	        height:470,
	    	        width:800,
	    	        modal: true,
	    	        buttons: {
	    	        	"Thanh Toán": function() {
	    	            },
	    	            
	    	            "Lưu Lại": function() {
	    	            },
	    	            
	    	            "Đóng": function() {
	    	            	$( this ).dialog( "close" );
	    	            }
	    	        }
	    	    });
	        	
	        },
	    	error: function (X) {
	    	}
	    });
	});
	
});